<template>
  <van-tabbar route>
    <van-tabbar-item to="/" icon="home-o">home</van-tabbar-item>
    <van-tabbar-item to="/cart" icon="cart-o">cart</van-tabbar-item>
    <van-tabbar-item :to="userPath" icon="user-o">{{
      userContent
    }}</van-tabbar-item>
  </van-tabbar>
</template>

<script setup lang="ts">
import { computed } from 'vue'

const userPath = computed(() =>
  localStorage.getItem('token') ? '/user' : '/login'
)
const userContent = computed(() =>
  localStorage.getItem('token') ? 'user' : 'login'
)
</script>

<style lang="scss" scoped>
.van-tabbar {
  height: 100px;
}
</style>
